//商品放大镜封装函数
function magnifier(){
    $(".magnifier").hover(function () {
        $(".mask").show()
        $(".big").show()
        $(".magnifier").mousemove(e => {
            var left = e.pageX - $(".mask").width()/2
            var top = e.pageY - $(".mask").height()/2
            if(left<$('.magnifier').offset().left) left = $('.magnifier').offset().left
            if(top<$('.magnifier').offset().top) top = $('.magnifier').offset().top
            if(left>$('.magnifier').width()-$('.mask').width()+$('.magnifier').offset().left){
                left = $('.magnifier').width()-$('.mask').width()+$('.magnifier').offset().left
            } 
            if(top>$('.magnifier').height()-$('.mask').height()+$('.magnifier').offset().top){
                top = $('.magnifier').height()-$('.mask').height()+$('.magnifier').offset().top
            } 
                $('.mask').offset({left,top})
            var bigLeft = (left - $('.magnifier').offset().left) / $('.magnifier').width() * $('.big img').width()
            var bigTop = (top - $('.magnifier').offset().top) / $('.magnifier').height() * $('.big img').height()
            $('.big img').css({
                left:-bigLeft + "px",
                top:-bigTop+"px"
            })
        })
    }, function () {
        $(".mask").hide()
        $(".big").hide()
    })
}
//tab切换获取的商品详情跟评价
$(function(){
    $('.tab ul li').click(function(){
    $(this).addClass('active').siblings().removeClass('active')
    $('.tab ol li').eq($(this).index()).addClass('active').siblings().removeClass('active')
    })
})

// //获取当前数据的id - 地址栏中的数据
var search = location.search
var arr = /id=(\d+)/.exec(search)
    if(!arr){
        layer.msg('非法请求',{
            icon:2,
            time:2000
        },function(){
            location.href = 'xiaomi.html'
        })
    }
var id = arr[1]
// console.log(id)
var loadindex = layer.load(0,{
    shade:[0.2,'skyblue']
})
$.get('php/details.php',{id},res=>{
    console.log(res)
    layer.close(loadindex)
    var {meta:{status,msg},data} = res
    if(status === 1){
        $(".magnifier-img").attr('src',data.imgpath)
        $(".big img").attr('src',data.imgpath)
        $(".goods h3").text(data.name)
        $(".goods-title").text(data.title)
        $(".goods-price span").text(data.price)
        $(".color1").text(data.color)
        $(".color2").text(data.color2)
        $('.tab ol li:first').html(data.interduce)
        $('.tab ol li:last').html(data.evaluate)
        //启动放大镜
        magnifier()
        addCart()
    }
},'json')

//加入购物车：用本地存储 - 模拟购物车数据
//[{goodsid number userid},{goodsid number userid}]
function addCart(){
    $('.addcart').click(function(){
        var username = getCookie('username')
        if(!username){
            layer.msg('请先登录',{
                icon:2,
                time:2300
            },function(){
                //获取当前页面的url - 存在本地存储
                localStorage.setItem('url',location.href)
                location.href = 'login.html'
            })
            return false;
        }
        //先获取本地存储，是否有数据，有就追加，没有就新增
        var data = localStorage.getItem('data')
        if(data){
            var arr = JSON.parse(data)
            //筛选一下是否有当前这条数据
            var obj = arr.find(item=>item.username === username && item.goodsid === id)
            if(obj){
                obj.number += 1
            }else{
                var obj = {
                    goodsid:id,
                    username,
                    number:1
                }
                arr.push(obj)
            }
        }else{
            var arr = [{
                goodsid:id,
                username,
                number:1
            }]
        }
        localStorage.setItem('data',JSON.stringify(arr))
    })
}